<!DOCTYPE html>
<html class="loading" lang="en" data-textdirection="ltr" xmlns:th="http://www.thymeleaf.org">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
  <meta name="author" content="PIXINVENT">
  <title>员工请假申请单</title>
  <link rel="stylesheet" type="text/css" href="app-assets/css/vendors.css">
  <link rel="stylesheet" type="text/css" href="app-assets/css/vertical-menu.css">
  <link rel="stylesheet" type="text/css" href="app-assets/css/bootstrap-extended.css">
</head>

<body>
  <div class="content-wrapper">
    <div class="content-header ">
      <div class="content-header-left mb-2 ">

        <h3 class="content-header-title mb-0">申请人信息 </h3>

      </div>
    </div>

    <div class="card">
      <div class="card-content">
        <div class="card-body">
          <div class="tablebox1">

            <div class="modal-body">
              <div class="form1 form2">
                <ul class="row">
                  <li class="col-xs-20"><span>姓名：</span>
                    <input type="text" class="form-control" value="李四">
                  </li>

                  <li class="col-xs-20"><span>编号：</span>
                    <input type="text" class="form-control" value=" ">
                  </li>
                  <div class="form-group">
                    <input type="text" id="test1" class="form-control" placeholder="请选择起止日期" style="min-width: 60px;">

                  </div>
                  <li class="col-xs-20"><span>请假原因：</span>
                    <input type="text" class="form-control" value="生病了">
                  </li>
                  <li class="col-xs-10">
                    <span>职务：</span>
                    <select class="form-control">
                      <option value="1" selected="">程序员</option>
                      <option value="0">销售</option>
                      <option value="2">UI设计师</option>
                      <option value="3">运维工程师</option>
                    </select>
                  </li>
                  <li class="col-xs-10">
                    <span>所在部门：</span>
                    <select class="form-control">
                      <option value="1" selected="">技术部</option>
                      <option value="0">推广部</option>
                    </select>
                  </li>

                </ul>
                <a href="#" class="btn btn-primary btn-td" data-toggle="modal" data-target="#myModal">修改</a>
                <a href="#" class="btn btn-danger btn-td">提交</a>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>


  <div class="content-wrapper">
    <div class="content-header ">
      <div class="content-header-left mb-2 ">

        <h3 class="content-header-title mb-0">本年度休假记录  <a th:href="@{/}">返回首页</a></h3>

      </div>
    </div>

    <div class="card">
      <div class="card-content">
        <div class="card-body">

          <!-- <div class="funcbtn clearfix">
            <div class="pull-left"><a class="btn btn-info" href="#" data-toggle="modal" data-target="#myModal">
                薪资录入</a></div>
          </div> -->
          <div class="tablebox1">
            <table class="table">
              <thead>
                <thead>
                  <tr>
                    <th>编号</th>
                    <th>姓名</th>
                    <th>职务</th>
                    <th>部门</th>
                    <th>类型</th>
                    <th>请假日期</th>
                    <th>登记日期</th>
                    <th>请假说明</th>
                  </tr>
                </thead>
              </thead>
              <tbody>

                <!-- <td>
                    <a href="#" class="btn btn-primary btn-td" data-toggle="modal" data-target="#myModal">修改</a>
                    <a href="#" class="btn btn-danger btn-td">删除</a>
                  </td> -->
                <tr th:each="el : ${pageInfo.getList()}">
                  <td th:text="${el.fromId}">001</td>
                  <td th:text="${el.employeeName}">张三</td>
                  <td th:text="${el.postName}">程序员</td>
                  <td th:text="${el.departmentName}">技术部</td>
                  <td th:switch="${el.fromType}">
                    <span th:case="1">
                      事假
                    </span>
                    <span th:case="2">
                      病假
                    </span>
                    <span th:case="3">
                      工伤假
                    </span>
                    <span th:case="4">
                      婚假
                    </span>
                    <span th:case="5">
                      产假
                    </span>
                    <span th:case="6">
                      丧假
                    </span>
                    <span th:case="*">
                      未知
                    </span>
                  </td>
                  <td th:text="${#dates.format(el.startTime,'yyyy-MM-dd HH:mm:ss')}">2021-9-24 00:00:00.0</td>
                  <td th:text="${#dates.format(el.endTime,'yyyy-MM-dd HH:mm:ss')}">2021-9-24 21:00:00.0</td>
                  <td th:text="${el.reason}">病假</td>
                   <td>
                    <a href="#" class="btn btn-primary btn-td" data-toggle="modal" data-target="#myModal">修改</a>
                    <a href="#" class="btn btn-danger btn-td">删除</a>
                  </td>
                </tr>
              </tbody>
            </table>

            <div class="page clearfix">
              <div class="pull-left">共 50条记录 第 1 / 20 页</div>
              <div class="pull-right">

                <nav aria-label="..." class="pull-left">
                  <ul class="pagination">
                    <li class="disabled"><a href="#" aria-label="Previous"><span aria-hidden="true">«</span></a></li>
                    <li class="active"><a href="#">1 <span class="sr-only">(current)</span></a></li>
                    <li><a href="#">2</a></li>
                    <li><a href="#">3</a></li>
                    <li><a href="#">4</a></li>
                    <li><a href="#">5</a></li>
                    <li><a href="#" aria-label="Next"><span aria-hidden="true">»</span></a></li>
                  </ul>
                </nav>

                <div class="pull-left p-r-20  p-l-20"><select class="form-control">
                    <option>10条每页</option>
                  </select></div>
                <div class="pull-left">跳至<input type="text" value="5" class="form-control">页</div>
              </div>

            </div>

          </div>
        </div>
      </div>
    </div>

  </div>
  <script src="app-assets/js/vendors.min.js" type="text/javascript"></script>
  <script src="app-assets/js/app-menu.js" type="text/javascript"></script>
  <script src="app-assets/js/app.js" type="text/javascript"></script>
  <script src="app-assets/js/echarts.min.js" type="text/javascript"></script>
<!--   <script src="app-assets/laydate/laydate.js" type="text/javascript"></script> //时间选择的在这一部分-->
 <script>
    $(document).ready(function () {
      $(".ewm").click(function () {
        $(this).toggleClass("active")
      });
    });
  </script>

</body>

</html>
